<template>
    <view v-if="isShowNavBar">
        <u-navbar :title="title" :bgColor="bgColor" placeholder @leftClick="handleLeftClick">
            <view v-if="isShowLeft" slot="left">
                <u-icon v-if="type === 'back'" name="arrow-left" size="20" :color="color"></u-icon>
                <u-icon v-if="type === 'home'" name="home-fill" size="20" :color="color"></u-icon>
            </view>
            <view v-else slot="left"></view>
        </u-navbar>
    </view>
</template>

<script>
export default {
    name: 'NavPage',
    props: {
        // 标题
        title: {
            type: String,
            default: '运输平台'
        },
        // 是否展示左侧
        isShowLeft: {
            type: Boolean,
            default: true
        },
        // 是否展示右侧图标
        bgColor: {
            type: String,
            default: '#fff'
        },
        color: {
            type: String,
            default: '#303133'
        }
    },
    data() {
        return {
            type: 'back', //  back:上一页 ，home，主页
            isShowNavBar: true // 是否显示自定义navbar
        };
    },
    created() {
        this.init();
    },
    methods: {
        init() {
            const pages = getCurrentPages();

            const currentPage = pages[pages.length - 1];

            // 获取原生导航栏高度
            const protogenesisNavBarHeight = currentPage.__page__.meta.windowTop;

            if (protogenesisNavBarHeight) {
                this.isShowNavBar = false;
            } else {
                this.isShowNavBar = true;
            }

            if (!this.isShowLeft) return;
            if (pages.length === 1) {
                this.type = 'home';
            } else {
                this.type = 'back';
            }
        },
        handleLeftClick() {
            if (!this.isShowLeft) return;
            if (this.type === 'back') {
                uni.navigateBack({
                    delta: 1
                });
            } else if (this.type === 'home') {
                uni.reLaunch({
                    url: '/pages/home/home'
                });
            }
        }
    }
};
</script>

<style lang="scss" scoped></style>
